<template>
    <div>
        <div style="margin:100px">
            <avue-crud :option="option" :data="data" @row-save="rowSave" @row-update="rowUpdate"
                @row-del="rowDel"></avue-crud>
        </div>

    </div>
</template>

<script>
export default {
    data() {
        return {
            form: {},
            data: [],
            option: {
                labelWidth: 120,
                column: {
                    id: {
                        label: 'ID',
                        editDisabled: true,
                        addDisplay: false
                    },
                    personId: {
                        label: '体侧对象',
                        type: 'select',
                        props: {
                            label: 'name',
                            value: 'id'
                        },
                        dicUrl: `http://localhost:8080/student/list`,
                    },
                    itemId: {
                        label: '体侧项目',
                        type: 'select',
                        props: {
                            label: 'name',
                            value: 'id'
                        },
                        dicUrl: `http://localhost:8080/test-item/list`,
                    },
                    value: {
                        label: '数值'
                    },
                    createdAt: {
                        label: '录入日期',
                        editDisabled: true,
                        addDisplay: false
                    },
                    testDate: {
                        label: '体侧日期',
                        type: "datetime",
                        format: 'yyyy年MM月dd日',
                        valueFormat: 'yyyy-MM-dd'
                    }

                }
            }
        }
    },
    methods: {
        rowSave(form, done) {
            this.$ajax.post("/test-data", form).then(res => {
                if (res.code === 200) {
                    this.$message.success('新增OK');
                    done();
                    this.fetchData();
                }
            })
        },
        rowDel(form) {
            this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                this.$ajax.get("/test-data/remove/" + form.id).then(res => {
                    if (res.code === 200) {
                        this.$message.success('移除OK');
                        this.fetchData();
                    }
                })
            }).catch(() => { });
        },
        rowUpdate(form, index, done) {
            this.$ajax.post("/test-data", form).then(res => {
                if (res.code === 200) {
                    this.$message.success('修改OK');
                    done(form);
                }
            })
        },
        fetchData() {
            this.$ajax.get("/test-data/list").then(res => {
                this.data = res
            })
        }
    },
    created() {
        this.fetchData();
    }
}
</script>
